<script setup>
import { ref, reactive, toRaw } from 'vue';
import { service, cache } from '@utils';
import { ElMessage } from 'element-plus';

const emit = defineEmits(['refresh']);

const visible = ref(false);
const formRef = ref();
const data = ref();

const state = reactive({
    param: {},
});

const rules = {
    auditResult: [{ required: true, message: '请选择', trigger: 'change' }],
};

const open = item => {
    data.value = item;
    visible.value = true;
};

const close = () => {
    visible.value = false;
    data.value = null;
    state.param = {};
};

const sure = async () => {
    formRef.value.validate(valid => {
        if (valid) {
            realSubmit();
        }
    });
};
const realSubmit = async () => {
    const { auditRemark, auditResult } = toRaw(state.param);
    const res = await service.fund.withdrawAudit({ status: auditResult, remark: auditRemark, withdrawRecordId: data.value.withdrawRecordId });
    if (res) {
        ElMessage.success('操作成功');
        close();
        emit('refresh');
    }
};
//把方法暴露给父组件
defineExpose({
    open,
});
</script>
<template>
    <el-dialog v-model="visible" title="审核" center :close-on-click-modal="false" @close="close" destroy-on-close :width="500">
        <section v-if="data">
            <el-form :model="state.param" :rules="rules" ref="formRef" label-width="100px" label-suffix=":" onsubmit="return false;">
                <el-form-item label="提现金额">{{ data.withdrawAmount }}</el-form-item>
                <el-form-item label="收款人">{{ data.payeeName }}</el-form-item>
                <el-form-item label="收款账户">{{ data.payeeAccountNo }}</el-form-item>
                <el-form-item label="收款类型">{{ data.payeeAccountType == 1 ?'支付宝':'其他' }}</el-form-item>
                <el-form-item label="审批结果" prop="auditResult">
                    <el-radio-group v-model="state.param.auditResult">
                        <el-radio :label="3">同意</el-radio>
                        <el-radio :label="2">驳回</el-radio>
                    </el-radio-group>
                </el-form-item>
                <el-form-item label="审批备注" prop="auditRemark">
                    <el-input v-model="state.param.auditRemark" type="textarea" placeholder="请输入备注" :rows="3" :maxlength="150" show-word-limit clearable></el-input>
                </el-form-item>
            </el-form>
        </section>

        <template #footer>
            <span class="flex-align-end">
                <div class="margin-right20">
                    <el-button @click="close">取消</el-button>
                </div>
                <el-button type="primary" @click="sure">确定</el-button>
            </span>
        </template>
    </el-dialog>
</template>
